<style>
.headinfo .child.userinfo .face {
    border: 0.1rem solid #fff; 
}
.bottombg {bottom:-20px;width:100%;height:11rem;border-bottom-right-radius:100% 40px;border-bottom-left-radius:100% 40px;}
.mod-group {
    margin: 0 auto;
	margin-top: 0;
    padding:0.5rem;
}
.fui-icon-group .fui-icon-col-sm {
    margin:10px 0;
}
.subtitle {
    font-size: 0.7rem;
}
.badge {
    left: 2rem;
    top: 0;
}
.fui-page .fui-page-title {
    color:#d9d5ca;
	padding: 0.3rem 0.5rem;
}
.fui-navbar .buybtn  {padding-left:0.3rem;background:#fff}
.fee-tag-nav, .fee-tagup-nav, .fee-disabled-nav {border-radius:1rem;height:2rem;line-height:2rem;color:#fff;width:100%;font-weight:400;font-size:0.7rem;margin:0.2rem 0;padding:0 0.5rem}
.fee-tagup {background:#e7bf82;color:#fff;width:auto;font-weight:400;font-size:0.55rem}
.fee-tag-nav {background:#e7bf82;}
.fee-tagup-nav {background:#e7bf82;}
.fui-tab-scroll .item {
    margin:0.1rem;height:5rem;line-height:1.4;padding: 0.25rem;
}
<style>
	  .rp-container {
    padding-left:10px;
    padding-right:10px;
  }
  .rp-background-lightgray {
    background-color:rgb(240, 240, 240);
  }
  .rp-record {
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid rgb(240, 240, 240) ;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .rp-record .avatar {
    width: 50px;
    border-radius: 3px;
  }
  .rp-record .info {
    display: inline-block;
    width: 100%;
  }
  .rp-record .desc {
    display:inline-block;
    margin-left: 1em;
  }
  .rp-record .datetime {
    color: rgb(200, 200, 200);
  }
  .rp-record .amount {
    float: right;
  }
</style>
<style>
.ui-step {
    padding:0.3rem 0;
    zoom: 1;
    margin: 0 0.3rem;
}
.ui-step:after {
    content: "";
    display: table;
    clear: both
}
.ui-step li {
    float: left;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	list-style:none;
    text-align: center
}
.ui-step li::before, .ui-step li::after {
    position: absolute;
    left: 0;
    top: 20px;
    display: block;
    content: ' ';
    width: 50%;
    height: 4px;
    background: #f2f3f7;
    z-index: 1
}
.ui-step li::after {
    left: 50%
}
.ui-step li:first-child::before {
    width: 0
}
.ui-step li:last-child::after {
    width: 0
}
.ui-step .ui-step-title {
    color: #333;
    font-size: 0.5rem;
    line-height: 18px
}
.ui-step .ui-step-number {
    position: relative;
    display: inline-block;
    width: 37px;
    height: 37px;
    margin: 5px 0;
    line-height: 37px;
    background: #f2f3f7;
    color: #cac9c9;
    border-radius: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 2;
}
.ui-step li.ui-step-done .ui-step-number {
    color: #fff;
}
.ui-step .ui-step-meta {
    color: #ccc;
	font-size:0.5rem
}
.ui-step li.ui-step-done::before,
.ui-step li.ui-step-done::after,
.ui-step li.ui-step-done .ui-step-number {
    background: #54c952
}
.ui-step-2 li {
    width: 50%
}
.ui-step-3 li {
    width: 33.33333%
}
.ui-step-4 li {
    width: 24.9999%
}
.ui-step-5 li {
    width: 20%
}
.ui-step-8 li {
    width: 12.499%;
}
</style>
<div class='fui-page fui-page-current' ng-if="pagedata.op=='main'">
<div class="fui-content" style="background:#fad19d">
		<div class="bottombg" style="background:#fa4e28;"></div>
		<div class="fui-page-title bold" style='margin-top:-10rem;color:#fff;font-size:1.5rem'>{{pagedata.sale_yao.title||'邀请好友赚39元'}}</div>
		<div class="fui-page-title bold overflow-h" style='font-size:0.85rem;padding-top:0'>{{pagedata.sale_yao.desc ||'限邀请人N天后消费N元！'}}</div>
		<div ng-if="pagedata.sale_yao.adimgtop" class="mod-group" style="padding:0.5rem">
			<img style="width:100%" ng-src="{{tomedia(pagedata.sale_yao.adimgtop)}}"/>
		</div>
		<div ng-if="pagedata.nocan!=1" class="fui-page-title bold" style='width:auto' ng-click="pagedata.showewm=true;pagedata.show_verify()">
			<div class="btn btn-default btn-banf" style="background:#fce6ce;color:#c4652f">
				面对面邀请 >>
			</div>
		</div>
		<div ng-if="pagedata.nocan==1" class="fui-page-title bold" style='width:auto'>
			<div class="btn btn-default btn-banf" style="background:#f2f2f2;color:#333">
				您无权参与该活动！！
			</div>
		</div>
		<div class="mod-group" style="padding-top:0;">
			<div class="fui-cell-group radius" style="padding:0.65rem 0.5rem;">
				<div class="fixed-title">
					<span class="befirst spacing">
						<span class="icon icon-fengexianzuo" style="font-size:2rem;color:#666"></span>
					 </span> 
					<span class="title-text bold" style="color:#ff422a;line-height:2rem"><i class="icon icon-xiai red" style="font-size:0.8rem;"></i> 多邀多得，奖励丰富</span> 
					<span class="spacing">
						 <span class="icon icon-fengexianyou" style="font-size:2rem;color:#666"></span>
					</span>
				</div>
				<div class="gray c">
					本轮在{{pagedata.yao_days ||'N'}}天后结束
				</div>
				<div class="fui-tab-scroll" style="background: #fff;padding:0;height:auto">
					<div ng-repeat="item in pagedata.jianglist" class="radius item">
						<div class="icon" style="position: relative;">
							<img style="width:4.6rem" src="/addons/jy_weishop/resource/images/jiang.jpg"/>
							<div class="c" style="width:100%;position: absolute;color:#fb6a2f;font-size:0.4rem;top:0.15rem">{{$index+1}}阶奖励</div>
							<div class="c bold" style="width:100%;position: absolute;color:#fd362f;font-size:0.65rem;top:0.8rem">
							<span style="font-size:1.3rem">{{item.fee}}</span>元
							</div>
							<div class="c bold" style="width:100%;position: absolute;color:#f2f2f2;font-size:0.65rem;bottom:0.35rem">{{pagedata.yao_feetypetitle}}</div>
						</div>
					</div>
				</div>
				<div ng-if="pagedata.jianglist.length>3" class="gray c" style="font-size:0.5rem"><<左右滑动显示更多>></div>
				<div class="step-region">
				<ul class="ui-step ui-step-{{pagedata.jianglist.length||3}}">
					<li ng-repeat="item in pagedata.jianglist" ng-class="{'ui-step-done':pagedata.isyaonum>=$index+1}">
						<div class="ui-step-number">{{$index+1}}</div>
						<div ng-if="item.yao_jitype!=1" class="ui-step-title">邀请第{{item.num}}人</div>
						<div ng-if="item.yao_jitype==1" class="ui-step-title">每邀请{{item.num}}人</div>
					</li>
				</ul>
				</div>
				<div ng-click="pagedata.showlog=true" class="syscolor c" style="font-size:0.65rem">查看邀请记录>></div>
			</div>
		</div>
		<div ng-if="pagedata.sale_yao.adimg" class="mod-group" style="padding-top:0;margin-bottom:1rem">
			<div class="fui-cell-group radius" style="padding:0.65rem 0.5rem;">
				<img style="width:100%" ng-src="{{tomedia(pagedata.sale_yao.adimg)}}"/>
			</div>
		</div>
		<div class="fui-navbar-tip overflow-h" ng-click="pagedata.show_xieyi=true" style="bottom:0">点击阅读《活动规则》</div>
</div>
</div>
<div ng-if="pagedata.show_xieyi" class="popup">
	<div class="popup-body">
		<div class="popup-center">
			<i class="closed icon icon-cuowu" style="font-size:1.2rem;top:105%;" ng-click="pagedata.show_xieyi=false"></i>
			<div class="content-images" style="padding:0.5rem;height:20rem; overflow-y:scroll;">
					<div class="title bold" style="font-size:0.8rem">活动规则 / <small>Read Ggree</small></div>
					<div class="text" style="padding-top:0.5rem;font-size:0.7rem" ng-bind-html="trust(pagedata.sale_yao.xieyi)">
					</div>
			</div>
		</div>
	</div>
</div>
<div ng-if="pagedata.showewm" class="popup">
	<div class="popup-body">
		<div class="popup-center" style="background:#d6404c;width:80%;padding:1rem">
			<i class="closed icon icon-cuowu" style="font-size:1.2rem;top:105%;" ng-click="pagedata.showewm=false"></i>
			<div class="content-images c">
				<div class="title" style="font-size:0.6rem;color:#ffe1c5">面对面邀请</div>
				<div class="title bold" style="font-size:0.8rem;color:#ffe1c5">邀请好友用微信扫一扫</div>
				<div class="img_box" id="show_verify_ewm" style="padding-top:0.3rem"></div>
			</div>
		</div>
	</div>
</div>
<div ng-if="pagedata.showlog" class="popup">
<div class="popup-body">
		<div class="popup-center" style="padding:0.5rem;width:80%">
		<i class="closed icon icon-cuowu" ng-click="pagedata.showlog=false"></i>
		<div class="rp-container"  style="background-color:white;height:9rem;overflow-y:scroll"> 
			<div ng-repeat="x in pagedata.list" class="rp-record">
			  <img ng-src="{{tomedia(x.avatar) ||'../core/resource/images/nopic.jpg'}}" class="avatar">
			  <div class="info" style="vertical-align: center">
				<span class="desc">
				  <div class="nickname" style="font-size:0.65rem">{{x.nickname}}</div>
				  <div class="red" style="font-size:0.5rem">{{x.typetitle||'消费金'}}</div>
				  <div class="datetime" style="font-size:0.5rem">{{x.createtime}}</div>
				</span>
				<span class="amount" ng-if="x.feetype!=2 && x.feetype!=10">{{x.fee}}个</span>
				<span class="amount" ng-if="x.feetype==2">{{x.fee}}元</span>
				<span class="amount" ng-if="x.feetype==10">一张</span>
			  </div>
			</div>
			<div class="content-empty" style="margin-top:1rem" ng-show="!pagedata.list || pagedata.list.length == 0">
			  <p style="color: #999;font-size: .75rem">您暂时没有的邀请记录！</p>
			</div>
		</div>
		</div>
</div>
</div>
<div ng-include="sys_html('_footer')"></div>
<script type="text/javascript">
scope.pagedata.show_verify=function(){
	var url=scope.pagedata.myurl;
	scope.tool.qr(url,'show_verify_ewm',230)
}
</script>
<script>
scope.tool.get_list('jy_weishop/sale.yao/getlist/yaoid='+scope.pagedata.isyao.id,true);
scope.pagedata.scroll_bottom=function(){
	scope.tool.get_list('jy_weishop/sale.yao/getlist/yaoid='+scope.pagedata.isyao.id);
}
</script>